---
name: 面包屑导航 breadcrumb
route: /breadcrumb
---

import { Playground, PropsTable } from 'docz'
import Breadcrumb from './index.js'

import './index.scss'

# 面包屑导航

停杯投`箸`不能食，拔剑四顾心茫然

## 代码演示

### 基本用法

<Playground>
  <Breadcrumb 
    list={
      [
        { value: '百度', href: '//www.baidu.com' },
        { value: '谷歌', href: '//www.google.com' },
        { value: '必应' }
      ]
    } 
  />
</Playground>

### 直接调用

<Playground>
  <Breadcrumb>
    <Breadcrumb.Item value="百度" href="//www.baidu.com" />
    <Breadcrumb.Item value="谷歌" href="//www.google.com" />
    <Breadcrumb.Item value="必应" />
  </Breadcrumb>
</Playground>

## 属性

### Breadcrumb

<PropsTable of={Breadcrumb} />

### BreadcrumbItem

<PropsTable of={Breadcrumb.Item} />
